﻿<mockups:WindowsPhoneChrome 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mockups="clr-namespace:Microsoft.Expression.Prototyping.WindowsPhone.Mockups;assembly=WindowsPhone.Mockups"
    xmlns:pc="http://schemas.microsoft.com/prototyping/2010/controls"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:pi="http://schemas.microsoft.com/prototyping/2010/interactivity"
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
	xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
    xmlns:SampleData="clr-namespace:Expression.Blend.SampleData.SampleDataSource" xmlns:wp="http://schemas.microsoft.com/prototyping/2010/controls/windowsphone"
    mc:Ignorable="d"
    x:Class="MS_SocialPhotoSketchScreens.CommentPage"
    x:Name="PhoneChrome">
	<mockups:WindowsPhoneChrome.Resources>
<!-- Resource dictionary entries should be defined here. -->
		<SampleData:SampleDataSource x:Key="SampleDataSource" d:IsDataSource="True"/>
	</mockups:WindowsPhoneChrome.Resources>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="OrientationChanged">
            <i:Interaction.Behaviors>
                <ei:ConditionBehavior>
                    <ei:ConditionalExpression>
                        <ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
                                                RightOperand="Landscape" />
                    </ei:ConditionalExpression>
                </ei:ConditionBehavior>
            </i:Interaction.Behaviors>
            <mockups:GoToStateAction StateName="Landscape"
                                     TargetObject="{Binding ElementName=LayoutRoot}"
                                     TargetName="LayoutRoot" />
        </i:EventTrigger>
        <i:EventTrigger EventName="OrientationChanged">
            <i:Interaction.Behaviors>
                <ei:ConditionBehavior>
                    <ei:ConditionalExpression>
                        <ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
                                                RightOperand="Portrait" />
                    </ei:ConditionalExpression>
                </ei:ConditionBehavior>
            </i:Interaction.Behaviors>
            <mockups:GoToStateAction StateName="Portrait"
                                     TargetObject="{Binding ElementName=LayoutRoot}"
                                     TargetName="LayoutRoot" />
        </i:EventTrigger>
    </i:Interaction.Triggers>

    <mockups:WindowsPhoneChrome.BackButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateBackAction />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/back.png" />
        </Button>
    </mockups:WindowsPhoneChrome.BackButton>

    <mockups:WindowsPhoneChrome.HomeButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.Home" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/home.png" />
        </Button>
    </mockups:WindowsPhoneChrome.HomeButton>

    <mockups:WindowsPhoneChrome.SearchButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.Search" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/search.png" />
        </Button>
    </mockups:WindowsPhoneChrome.SearchButton>

    <Grid x:Name="LayoutRoot">
        <VisualStateManager.CustomVisualStateManager>
            <ei:ExtendedVisualStateManager />
        </VisualStateManager.CustomVisualStateManager>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates"
                              ei:ExtendedVisualStateManager.UseFluidLayout="True">
                <VisualState x:Name="Portrait" />
                <VisualState x:Name="Landscape">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(WindowsPhoneChrome.PageOrientation)"
                                                       Storyboard.TargetName="PhoneChrome">
                            <DiscreteObjectKeyFrame KeyTime="0">
                                <DiscreteObjectKeyFrame.Value>
                                    <mockups:PageOrientation>Landscape</mockups:PageOrientation>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    	<Grid x:Name="LayoutRoot_Copy" DataContext="{Binding Source={StaticResource SampleDataSource}}">
    		<Grid.RowDefinitions>
    			<RowDefinition Height="*"/>
    			<RowDefinition Height="auto"/>
    		</Grid.RowDefinitions>
    		<VisualStateManager.CustomVisualStateManager>
    			<ei:ExtendedVisualStateManager />
    		</VisualStateManager.CustomVisualStateManager>
    		<VisualStateManager.VisualStateGroups>
    			<VisualStateGroup x:Name="CommonStates1"
    				ei:ExtendedVisualStateManager.UseFluidLayout="True">
    				<VisualState x:Name="Portrait1" />
    				<VisualState x:Name="Landscape1">
    					<Storyboard>
    						<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(WindowsPhoneChrome.PageOrientation)"
    							Storyboard.TargetName="PhoneChrome">
    							<DiscreteObjectKeyFrame KeyTime="0">
    								<DiscreteObjectKeyFrame.Value>
    									<mockups:PageOrientation>Landscape</mockups:PageOrientation>
    								</DiscreteObjectKeyFrame.Value>
    							</DiscreteObjectKeyFrame>
    						</ObjectAnimationUsingKeyFrames>
    					</Storyboard>
    				</VisualState>
    			</VisualStateGroup>
    		</VisualStateManager.VisualStateGroups>
    		<wp:Pivot Title="Social Photo" Margin="4" ItemsSource="{Binding SocialPhoto}">
    			<wp:Pivot.HeaderTemplate>
    				<DataTemplate>
    					
    				</DataTemplate> 		
    			</wp:Pivot.HeaderTemplate>
    			<wp:Pivot.ItemTemplate>
    				<DataTemplate>
    					<Grid>
    						<Grid.RowDefinitions>
    							<RowDefinition Height="auto"/>
    							<RowDefinition Height="auto"/>
								<RowDefinition Height="*"/>
								<RowDefinition Height="auto"/>
								<RowDefinition Height="auto"/>
    						</Grid.RowDefinitions>
							<StackPanel Orientation="Horizontal">
								<Image Source="{Binding Photo}" Width="300" VerticalAlignment="Top" HorizontalAlignment="Left"/>
								<Image Source="AppBarIcons/Like.png" VerticalAlignment="Top"/>
								<Image Source="AppBarIcons/Dislike.png" VerticalAlignment="Top"/>
							</StackPanel>
							<!--<ListBox x:Name="lvComment" Style="{StaticResource ListBox-Sketch}" ItemsSource="{Binding Comments}" Grid.Row="2" Margin="0,0,0,2">
								<ListBox.ItemTemplate>
									<DataTemplate>
											<TextBlock Text="{Binding Comment}" TextWrapping="Wrap"/>
									</DataTemplate>
								</ListBox.ItemTemplate>
								
							</ListBox>-->
    						<TextBlock Grid.Row="1"  Style="{StaticResource BasicTextBlock-Sketch}" TextWrapping="Wrap" Text="Comments" Margin="0,0,150,0" FontSize="24" FontWeight="Bold"/>
								<TextBox Grid.Row="2" Style="{StaticResource BasicTextBox-Sketch}" TextWrapping="Wrap" AcceptsReturn="True" FontSize="24"/>
								<Button Grid.Row="3" Content="Sent" Height="60" HorizontalAlignment="Right" Width="100" Style="{StaticResource Button-Sketch}" />
							<mockups:KeyboardMockup Grid.Row="4"/>
    					</Grid>
    				</DataTemplate>
    			</wp:Pivot.ItemTemplate>
    		</wp:Pivot>
    	</Grid>
    </Grid>
</mockups:WindowsPhoneChrome>
